<template>
	<div class="menu-list">
		<router-link v-for="(v, i) in list" :key="i" :to="v.path">{{ v.meta!.title }}</router-link>
	</div>
</template>

<script lang="ts" setup>
import { defineProps } from 'vue'
import { RouteRecordRaw } from 'vue-router'
defineProps<{
	list: RouteRecordRaw[]
}>()
</script>


<style scoped lang="scss">
.menu-list {
	display: flex;
	justify-content: space-around;
	align-items: center;
	height: 60px;
	a {
		color: #000;
		&.router-link-exact-active {
			color: red;
		}
	}
}
</style>